import 'package:flutter/material.dart';

import '../package_model_comm.dart';

/*
 * @class DialogContent
 * @author: ZhongWb
 * @date: 2019/11/12 9:24
 * @description 弹出选择框
 **/
class DialogContent extends StatefulWidget {
  final String title;//标题  必传
  final double boxWidth;//宽度 非必传
  final double boxHeight;//高度 非必传
  final bool isDuoXuan; //切换单选-多选模式
  final Color boxColor;//弹出框背景颜色 非必传
  final double titleFontSize;//标题大小 非必传
  List<BaseModel> dialogData;//弹出框数据源 必传
  String selectId;//已选id 必传
  String selectName;//已选name 必传
  ValueChanged<BaseModel> valueChanged;//选中后回调
  DialogContent(
      {this.title,
      this.boxHeight:300,
      this.boxWidth:300,
      this.isDuoXuan: true,
      this.dialogData,
      this.boxColor,
        this.valueChanged,this.titleFontSize,this.selectId,this.selectName
      });

  @override
  State<StatefulWidget> createState() => DialogContentState();
}

class DialogContentState extends State<DialogContent> {
  List<BaseModel> dialogData = [];//数据源
  List<String> idList = [];//多选 选择的id  回调 +  接收
  List<String> nameList = [];//多选 选择的name  只回调用于页面展示 不接收
  String dxId = "";////单选 选择的id  回调 +  接收
  String dxName = "";//单选 选择的name  只回调用于页面展示 不接收
  @override
  void initState() {
    super.initState();
    print(widget.selectId);
    //    接收的数据源不为空时
    if (widget.dialogData.isNotEmpty) {
      dialogData = widget.dialogData;
    }

    //判断单选还是多谢
    if(widget.isDuoXuan){
      //将接收的 已选id string 转换成 list
      if(widget.selectId !=null && widget.selectId !=""){
        setState(() {
          idList =  widget.selectId.split(",");
        });
      }
      //将接收的 已选name string 转换成 list
      if(widget.selectName !=null && widget.selectName !="" && widget.selectName !="点击选择"){
        setState(() {
          nameList =  widget.selectName.split(",");
        });
      }
    }else{
      if(widget.selectId !=null && widget.selectId !=""){
        setState(() {
          dxId = widget.selectId;
        });
      }
      if(widget.selectId !=null && widget.selectId !="" ){
        setState(() {
          dxName = widget.selectName;
        });
      }
    }

  }

//  @override
//  void didUpdateWidget(DialogContent oldWidget) {
//    // TODO: implement didUpdateWidget
//    print(widget.selectId);
//
//    super.didUpdateWidget(oldWidget);
//  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        //单选 才可 点击透明区域关闭弹框
        widget.isDuoXuan?print("多选模式-点击遮罩层无效"):Navigator.pop(context);
      },
      child: Material(
        child: Center(
          child: Container(
            width: widget.boxWidth ?? 300,
            height: widget.boxHeight ?? 300,
            decoration: BoxDecoration(
              color: widget.boxColor ?? Colors.white,
              borderRadius: BorderRadius.circular(6),
            ),
            child: Column(
              children: <Widget>[
                Container(
                  height: 50,
                  child: Text(
                    widget.title ?? '标题',
                    style: TextStyle(
                      fontSize: widget.titleFontSize ?? 16,
                    ),
                  ),
                  padding: EdgeInsets.only(
                    left: 10,
                  ),
                  alignment: Alignment.centerLeft,
                ),
                Container(
                  height: 1,
                  color: Colors.grey[200],
                ),
                Container(
                  // 多选 和 非多选的高度
                  height: widget.isDuoXuan
                      ? (widget.boxHeight - 50 - 50 - 2)
                      : (widget.boxHeight  - 50 - 1),
//                  color: Colors.yellow,
                  child:dialogData.length==0?Center(child: Text("没有数据~"),): ListView.builder(
                    itemCount: dialogData.length,
                    itemBuilder: (context, index) {
                      return InkWell(
                        onTap: (){
                          print("点击了："+dialogData[index].name);
                          //多选
                          if(widget.isDuoXuan){
                            // 判断是否已勾选
                            if (idList.contains(dialogData[index].id)) {
                              print('已勾选');
                              setState(() {
                                idList.remove(dialogData[index].id);
                                nameList.remove(dialogData[index].name);
                              });
                            }else{
                              print('未勾选');
                              setState(() {
                                idList.add(dialogData[index].id);
                                nameList.add(dialogData[index].name);
                              });
                            }
                          }else{//单选
                            setState(() {
                              dxId = dialogData[index].id;
                              dxName = dialogData[index].name;
                            });
                            if(dxId!="" && dxName!=""){
                              BaseModel model = new BaseModel();
                              model.name = dxName;
                              model.id = dxId;
                              widget.valueChanged(model);
                              Navigator.pop(context);
                            }else{
                              BaseModel model = new BaseModel();
                              widget.valueChanged(model);
                              Navigator.pop(context);
                            }
                          }
                        },
                        child: Container(
//                      color: Colors.green,
                          padding: EdgeInsets.all(10),
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: <Widget>[
                              widget.isDuoXuan?
                              Text(
                                dialogData[index].name,
                                style: TextStyle(
                                  fontSize: 16,
                                  color: idList.contains(dialogData[index].id) ?Colors.blueAccent:Color(0xff333333),
                                ),
                              ):Text(
                                dialogData[index].name,
                                style: TextStyle(
                                  fontSize: 16,
                                  color:  dxId==dialogData[index].id ?Colors.blueAccent:Color(0xff333333),
                                ),
                              ),
                              widget.isDuoXuan?
                              Icon(
                                Icons.check,
                                color:idList.contains(dialogData[index].id) ? Colors.blueAccent : Colors.transparent,
                              ):Icon(Icons.check,color: dxId==dialogData[index].id?Colors.blueAccent:Colors.transparent,),
                            ],
                          ),
                        ),
                      );
                    },
                  ),
                ),
                //多选踩显示  确定 取消 按钮
                widget.isDuoXuan
                    ? Container(
                        height: 1,
                        color: Colors.grey[200],
                      )
                    : Container(),
                widget.isDuoXuan
                    ? Container(
                        margin: EdgeInsets.only(left: 6,right: 6),
                        height: 50,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Expanded(
                              child: InkWell(
                                onTap: () {
                                  Navigator.pop(context);
                                },
                                child: Container(
                                  alignment: Alignment.center,
                                  child: Text(
                                    "取消",
                                    style: TextStyle(
                                      fontSize: 16,
                                    ),
                                  ),
                                ),
                              ),
                            ),
                            Container(
                              width: 1,
                              height: 50,
                              color: Colors.grey[200],
                            ),
                            Expanded(
                              child: InkWell(
                                onTap: () {
                                  String idStr = "";
                                  String nameStr = "";
                                  //将选择的id 进行拼接
                                  idList.forEach((f){
                                    idStr += f + ",";
                                  });
                                  nameList.forEach((f){
                                    nameStr += f + ",";
                                  });

                                  BaseModel model = new BaseModel();

                                  if(idStr != null && idStr != "") {
                                    model.id = idStr.substring(0,idStr.length-1);
                                  }
                                  if(nameStr != null && nameStr != "") {
                                    model.name = nameStr.substring(0,nameStr.length-1);
                                  }
                                  widget.valueChanged(model);
                                  Navigator.pop(context);
                                },
                                child: Container(
                                  alignment: Alignment.center,
                                  child: Text(
                                    "确定",
                                    style: TextStyle(fontSize: 16, color: Colors.blueAccent),
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      )
                    : Container(),
              ],
            ),
            alignment: Alignment.center,
          ),
        ),
        color: Colors.transparent,
      ),
    );
  }
}
